<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>登录页面</title>
<!-- Bootstrap core CSS -->
<link href="static/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- Custom styles for this template -->
<link href="static/css/login.css" rel="stylesheet">
</head>
<body>
	<div class="container" id="loginDiv">
		<form class="form-signin" method="post" action="">
			<h3 class="form-signin-heading">请登录</h3>
			<label for="inputEmail" class="sr-only">用户名</label>
			<input type="text" id="inputEmail" v-model="username" class="form-control" placeholder="用户名"
				name="username" required autofocus>
			<label for="inputPassword" class="sr-only">密码</label>
			<input type="password" id="inputPassword" v-model="password" class="form-control"
				placeholder="密码" name="password" required>
			<div class="checkbox">
				<label>
					<input type="checkbox" name="rememberMe">
					记住我
				</label>
			</div>
			<p v-if="error" class="bg-warning">{{errorMsg}}</p>
			<button class="btn btn-lg btn-primary btn-block" type="button" @click="login">登录</button>
		</form>

	</div>
	<script src="static/bower_components/jquery/dist/jquery.min.js"></script>
	<script src="static/plugins/vue/vue.min.js"></script>
	<script type="text/javascript">
		var vm = new Vue({
			el : "#loginDiv",
			data : {
				username : '',
				password : '',
				error : false,
				errorMsg : ''
			},
			methods : {
				login : function(event) {
					if (vm.username == '') {
						vm.error = true;
						vm.errorMsg = "用户名不能为空";
						return false;
					}
					if (vm.password == '') {
						vm.error = true;
						vm.errorMsg = "密码不能为空";
						return false;
					}
					$.ajax({
						type : "POST",
						url : "sys/login",
						data : {
							username : vm.username,
							password : vm.password
						},
						dataType : "json",
						success : function(result) {
							if (result.code == 0) {
								parent.location.href = "index.html";
							} else {
								vm.error = true;
								vm.errorMsg = result.msg;
							}
						}
					});
				}
			}
		})
	</script>
</body>
</html>